import { Graphics, Point } from "pixi.js";
import { ItransformableItem } from "../../controllers/ITransformableItem";


export class Translate extends Graphics {
    public arrowDown: Graphics;
    public target: ItransformableItem | null = null;

    constructor() {
        super();
        this.lineStyle(2, "red", 1);
        this.moveTo(0, 0);
        this.lineTo(40, 0);

        this.beginFill(0xffffff);
        this.drawPolygon([
            new Point(25, 5),             //First point
            new Point(40, 0),              //Second point
            new Point(25, -5),           //Third point
        ]);

        // // //Fill shape's color
        this.endFill();
        this.tint = "red"
        this.zIndex = 2;

        let arrowDown = new Graphics();
        arrowDown.lineStyle(2, "green", 1);
        arrowDown.moveTo(0, 0);
        arrowDown.lineTo(40, 0);
        arrowDown.beginFill(0xffffff);
        arrowDown.drawPolygon([
            new Point(25, 5),             //First point
            new Point(40, 0),              //Second point
            new Point(25, -5),           //Third point
        ]);

        // // //Fill shape's color
        arrowDown.endFill();
        arrowDown.tint = "green"
        arrowDown.rotation = 90 * Math.PI / 180;
        this.addChild(arrowDown);
        this.arrowDown = arrowDown;
    }

    public hoverMoveX() {
        this.tint = "white";
    }

    public hoverMoveY() {
        this.arrowDown.tint = "white";
    }

    public leaveMoveX() {
        this.tint = "red";
    }

    public leaveMoveY() {
        this.arrowDown.tint = "green";
    }
}
